<template>
	<view class="order_success">
		<view class="order_status">
			<image style="width: 150px;height: 150px;" mode="widthFix"
				src='https://img.youxuanan.com/crmebimage/public/product/2024/10/14/7b8bcc96fab04790b8b31cac919c4cc7ivbifhseh7.png'>
			</image>

			<view class="title-status">归还提交成功</view>
			<view class="order_tips">等待商家确认归还后，订单将完结，若归还设备不符归还要求，需赔付差价。</view>
		</view>

		<view class="order_btn">
			<view>
				<button @click="tapbackOrder">查看订单</button>
			</view>
			<view>
				<button @click="tapbackIndex">返回首页</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			tapbackOrder(){
				uni.switchTab({
					url: '/pages/user/index',
				})
			},
			tapbackIndex() {
				uni.switchTab({
					url: '/pages/index/index',
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.order_success {
		text-align: center;

		.order_status {
			background-color: white;
			padding: 30px 0 10px 0;

			.order_tips {
				color: #C0C4CC;
				font-size: 1em;
				padding: 5px 25px;
			}

			.title-status {
				font-size: 1.2em;
				font-weight: bold;
				margin: 15px 0;
			}
		}

		.order_freeBox {
			width: 85%;
			padding: 15px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			color: white;
			background-color: rgba(255, 110, 19, 1);
			margin: 15px auto;
			border-radius: 15px;

			& view:nth-child(2) {
				width: 50%;
				font-size: .8em;

			}

			& view:last-child {
				button {
					height: 30px;
					line-height: 30px;
					background-color: white;
					color: rgba(255, 110, 19, 1);
					font-size: .9em;
					padding: 0 20px;
					border-radius: 15px;
				}
			}
		}

		.order_btn {
			margin-top: 35px;
			display: flex;
			align-items: center;
			justify-content: space-between;

			view {
				width: 50%;
				display: flex;
				justify-content: center;

				button {
					width: 80%;
					border-radius: 15px;
				}
			}

			& view:first-child {
				button {
					color: rgba(255, 110, 19, 1);
					border: 1px solid rgba(255, 110, 19, 1);
				}
			}

			& view:last-child {
				button {
					background-color: rgba(255, 110, 19, 1);
					color: white;
				}
			}

			button {
				line-height: 45px;
			}
		}
	}
</style>